<template>
	<div>
		<!-- 		<div style="width: 100%;height: 100vh;background-color: rgb(0, 0, 0, 0.3);position: fixed;z-index: 999;">
			<i class="el-icon-loading" style="font-size: 50px;color: #ffffff;"></i>
		</div> -->
		<Navigation></Navigation>

		<div align="center">
			<div style="width: 60%;margin-top: 20px;margin-bottom: 20px;">

				<el-steps :active="1" align-center align="left" style="margin-bottom: 20px;">
					<el-step title="乘机信息"></el-step>
					<el-step title="确认信息"></el-step>
					<el-step title="支付"></el-step>
					<el-step title="完成"></el-step>
				</el-steps>

				<el-row>
					<el-col :span="16" align="left">
						<div
							style="width: 97%;box-shadow: 0px 0px 5px rgb(0, 0, 0, 0.1);margin-bottom: 20px;background-color: #fffcd5;padding-top: 5px;padding-bottom: 5px;">
							<div style="margin-left: 10px;">
								<i class="el-icon-warning" style="color: #ffaa00;margin-right: 5px;"></i>
								<span style="font-size: 14px;color:#A0A0A0;">请注意，系统默认选择经济舱，如需选择机舱，请点击右侧进行选择</span>
							</div>
						</div>
						<div
							style="width: 97%;box-shadow: 0px 0px 5px rgb(0, 0, 0, 0.2);padding-top: 20px;padding-bottom: 20px;">
							<div style="margin-left: 2.5%;" align="left">
								<div style="font-weight: 900;font-size: 20px;">乘机人</div>
								<div style="margin-top: 20px;">
									<el-checkbox v-model="item.selected" v-for="item in PassengerList"
										:label="item.passenger_name" border @change="changecheck($event,item)"
										style="margin-right: 10px;"></el-checkbox>
								</div>
								<div style="margin-top: 10px;width: 97.5%;" v-for="item in PassengerDisplay">
									<div style="width: 100%;border: #D8D8D8 1px solid;">
										<el-row>
											<el-col :span="4">
												<div
													style="font-weight: 900;font-size: 35px;color: #D8D8D8;margin-left: 10px;margin-top: 10px;">
													{{item[2]}}
												</div>
											</el-col>
											<el-col :span="20" style="margin-top: 15px;">
												<div style="width: 95%;">
													<input v-model="item[0].name" @blur="dataJudgmentName()"
														:class="!item[0].nodeName ? 'colorAsh' : 'colorRed'" style="border-top: none;outline: none;height: 30px; width: 100%;
										border-left: none;border-right: none;font-size: 14px;padding-left: 5px;" placeholder="请与登机时姓名一致" />
													<div v-show="item[0].nodeName"
														style="color: red;font-size: 10px;position: absolute;z-index: 9;">
														{{item[0].informationName}}
													</div>
													<el-row style="margin-top: 10px;">
														<el-col :span="3" style="font-size: 14px;height: 30px;">
															<div style="position: absolute;bottom: 0;">身份证</div>
														</el-col>
														<el-col :span="21">
															<input v-model="item[0].IDCard" @blur="dataJudgmentIDCard()"
																:class="!item[0].nodeIDCard ? 'colorAsh' : 'colorRed'"
																style="border-top: none;outline: none;height: 30px; width: 100%;
													  border-left: none;border-right: none;font-size: 14px;padding-left: 5px;" placeholder="登机证件号码" />
															<div v-show="item[0].nodeIDCard"
																style="color: red;font-size: 10px;position: absolute;z-index: 9;">
																{{item[0].informationIDCard}}
															</div>
														</el-col>
													</el-row>

													<el-row style="margin-top: 15px;margin-bottom: 10px;">
														<el-col :span="3" style="font-size: 14px;height: 30px;">
															<div style="position: absolute;bottom: 4px;">中国 86</div>
														</el-col>
														<el-col :span="21">
															<input v-model="item[0].phone"
																style="border-top: none;outline: none;height: 30px; width: 100%;
													  border-left: none;border-right: none;border-bottom: #D8D8D8 1px solid;font-size: 14px;padding-left: 5px;"
																placeholder="乘机人手机号码(选填)" />
														</el-col>
													</el-row>
													<div style="margin-bottom: 10px;font-size: 13px;" align="right">
														<a href="javascript:;" @click="deletePassengers(item[2],1)"
															style="text-decoration:none;color: #409EFF;">
															<i class="el-icon-close" style="margin-right: 2px;"></i>
															删除乘客
														</a>
													</div>
												</div>
											</el-col>
										</el-row>
									</div>

								</div>
								<div align="center" style="margin-top: 20px;font-weight: 900;font-size: 15px;">
									<a href="javascript:;" style="text-decoration:none;color: #409EFF;"
										@click="addPassengers()">
										<i class="el-icon-circle-plus-outline" style="margin-right: 5px;"></i>添加乘机人
									</a>
								</div>
							</div>
						</div>

						<div style="font-weight: 900;font-size: 20px;margin-top: 10px;margin-bottom: 10px;"
							align="left">
							联系人
						</div>

						<div style="width: 97%;box-shadow: 0px 0px 5px rgb(0, 0, 0, 0.2);padding-bottom: 10px;margin-bottom: 10px;"
							align="center">
							<input @blur="dataJudgmentMail()" style="border-top: none;outline: none;height: 40px; width: 93%;
						border-left: none;border-right: none;font-size: 15px;padding-left: 5px;" placeholder="Email邮箱(接收行程信息)"
								v-model="mailbox.mail" :class="!mailbox.nodeMail ? 'colorAsh' : 'colorRed'" />
							<div align="left" style="width: 93%;margin-top: 10px;font-size: 15px;"
								:class="!mailbox.nodeMail ? 'charactersAsh' : 'charactersRed'"><i
									class="el-icon-warning"
									style="margin-right: 5px;"></i>{{this.mailbox.informationMail}}</div>
						</div>

						<el-button type="primary" style="width: 97%;height: 60px;font-size: 22px;"
							@click="generateOrder()" :loading="submit">{{button}}</el-button>

					</el-col>
					<el-col :span="8">
						<div class="block">
							<el-carousel indicator-position="outside" arrow="never" :autoplay="false" :loop="false"
								height="430px" style="box-shadow: 0px 0px 5px rgb(0, 0, 0, 0.2);">
								<el-carousel-item v-for="item in flightInformation">
									<div style="width: 100%;background-color: rgb(255, 255, 255);padding-top: 30px;">

										<div style="font-size: 17px;font-weight: 900;">
											{{item.accurateTime[3]}}
											<span style="margin-left: 2px;">{{item.accurateTime[1]}}</span>
											<span style="margin-left: 10px;">{{item.departureCity.city_name}}</span>
											<span style="margin-left: 5px;">
												-
											</span>
											<span style="margin-left: 5px;">{{item.destinationCity.city_name}}</span>
										</div>

										<div style="margin-top: 10px;color: #000000;font-size: 14px;">
											{{item.flight_name}}
											<span style="margin-left: 10px;">
												{{item.model.model_name}}
											</span>
											<a href="javascript:;" style="text-decoration:none;">
												<span style="margin-left: 10px;">
													<select style="border: none;" class="select" align="center"
														v-model="item.priceDifferentiation">
														<option style="text-align:center;"
															v-for="(itemTwo,index) in item.cabin" :key="index"
															:value="index">{{itemTwo}}</option>
													</select>
												</span>
											</a>
										</div>

										<div>
											<div style="display: table;height: 80px;">
												<div style="display: table-cell;vertical-align: middle;">
													<div>
														<div style="text-align: right;">
															<span
																style="font-size: 25px;font-weight: 900;">{{item.departure_time}}</span>
														</div>
														<div>
															<span
																style="font-size: 14px;">{{item.setout_information.airport_name}}</span>
														</div>
													</div>
												</div>

												<div style="display: table-cell;vertical-align: middle;">
													<div>
														<div
															style="margin-left: 20px;margin-right: 20px;margin-bottom: 10px;">
															<span style="font-size: 10px;color: #A0A0A0;"><i
																	class="el-icon-time"
																	style="margin-right: 3px;"></i>{{item.timeOfFlight.hours}}h{{item.timeOfFlight.minutes}}m</span>
														</div>
														<div>
															<div
																style="height: 5px;width: 130px;background-color: #D8D8D8;margin-left: 20px;margin-right: 20px;">
															</div>
														</div>
													</div>
												</div>

												<div style="display: table-cell;vertical-align: middle;">
													<div>
														<div style="text-align: left;">
															<span
																style="font-size: 25px;font-weight: 900;">{{item.arrival_time}}</span>
														</div>
														<div>
															<span
																style="font-size: 14px;">{{item.arrive_information.airport_name}}</span>
														</div>
													</div>
												</div>
											</div>


											<hr
												style="margin-top: 20px;background-color: rgb(216, 216, 216);height: 1px;border:none">

											<div style="margin-top: 20px;width: 80%;margin-bottom: 20px;">
												<el-row>
													<el-col :span="12" align="left">成人</el-col>
													<el-col :span="12" align="right">
														￥{{item.price[item.priceDifferentiation]}}
														<span
															style="margin-left: 5px;margin-right: 5px;color: #a5a5a5;">x</span>
														<span style="color: #a5a5a5;">{{PassengerDisplay.length}}</span>
													</el-col>
												</el-row>
												<el-row style="margin-top: 10px;">
													<el-col :span="12" align="left">机建</el-col>
													<el-col :span="12" align="right">￥{{item.model.construction}}
														<span
															style="margin-left: 5px;margin-right: 5px;color: #a5a5a5;">x</span>
														<span style="color: #a5a5a5;">{{PassengerDisplay.length}}</span>
													</el-col>
												</el-row>
												<el-row style="margin-top: 10px;">
													<el-col :span="12" align="left">燃油税</el-col>
													<el-col :span="12" align="right">￥{{item.model.fuel_tax}}
														<span
															style="margin-left: 5px;margin-right: 5px;color: #a5a5a5;">x</span>
														<span style="color: #a5a5a5;">{{PassengerDisplay.length}}</span>
													</el-col>
												</el-row>
											</div>

											<hr style="background-color: rgb(216, 216, 216);height: 1px;border:none">

											<div style="width: 80%;margin-top: 20px;height: 150px;" align="right">
												<span style="font-weight: 900;font-size: 30px;color: #ffaa00;">
													￥{{(item.price[item.priceDifferentiation]*PassengerDisplay.length)+(item.model.construction*PassengerDisplay.length)+(item.model.fuel_tax*PassengerDisplay.length)}}
												</span>
											</div>

										</div>

									</div>
								</el-carousel-item>
							</el-carousel>
						</div>
					</el-col>
				</el-row>


			</div>
		</div>
		<BottomNavigation></BottomNavigation>
	</div>
</template>

<script>
	import Navigation from "../components/Navigation"
	import BottomNavigation from "../components/BottomNavigation"
	import axios from 'axios';

	export default {
		components: {
			Navigation,
			BottomNavigation
		},
		data() {
			return {
				button: "下一步",
				PassengerList: [],
				mailbox: {
					"mail": sessionStorage.getItem("mailbox"),
					"nodeMail": false,
					"informationMail": "订单信息会发送到此邮箱，请注意查收"
				},
				template: [{
						"name": '',
						"IDCard": '',
						"phone": '',
						"nodeName": false,
						"nodeIDCard": false,
						"informationName": '',
						"informationIDCard": ''
					},
					0,
					1,
					""
				],
				PassengerDisplay: [],
				flightInformation: [],
				submit: false,
				cityName:"",
				cityNameTwo:""
			}
		},
		created() {

			var PassengerDisplay = new Array(1);
			PassengerDisplay[0] = JSON.parse(JSON.stringify(this.template));
			this.PassengerDisplay = PassengerDisplay;

			if (sessionStorage.getItem("eleToken") == null) {
				this.$alert("登录失效，请重新登录", '提示', {
					confirmButtonText: '确定',
					type: 'error',
					callback: action => {
						sessionStorage.removeItem("mailbox");
						sessionStorage.removeItem("sessionId");
						location.href = "/Search";
					}
				});
				return;
			}

			var flightInformation = JSON.parse(sessionStorage.getItem("flightIn"));
			if (flightInformation == null) {
				location.href = "/Search";
				return;
			}
			this.flightInformation = flightInformation;
			
			this.cityName=sessionStorage.getItem("cityName");
			if (this.cityName == null) {
				location.href = "/Search";
				return;
			}
			
			this.cityNameTwo=sessionStorage.getItem("cityNameTwo");
			if (this.cityNameTwo == null) {
				location.href = "/Search";
				return;
			}

			axios.post("api/PassengerAction/passengerList")
				.then((res) => {
					if (res.data.code === 200) {
						if (res.data.data !== undefined) {
							this.PassengerList = res.data.data;
							for (var i = 0; i < this.PassengerList.length; i++) {
								this.PassengerList[i].selected = false;
							}
						} else {
							this.PassengerList = [];
						}
					} else {
						if (res.data.code === 401 || res.data.code === 403) {
							this.$alert(res.data.msg, '提示', {
								confirmButtonText: '确定',
								type: 'error',
								callback: action => {
									sessionStorage.removeItem("eleToken");
									sessionStorage.removeItem("mailbox");
									sessionStorage.removeItem("sessionId");
									location.href = "/Search";
								}
							});
						} else {
							this.$message({
								dangerouslyUseHTMLString: true,
								message: '<strong>' + res.data.msg + '</strong>',
								type: 'error'
							});
						}
					}
				})
		},
		methods: {
			generateOrder() {
				if (!this.submit) {
					this.submit = true;
					this.button = "加载中";

					var PassengerDisplay = this.PassengerDisplay;
					var isSubmit = true;
					for (var i = 0; i < PassengerDisplay.length; i++) {
						if (PassengerDisplay[i][0].name.length <= 0) {
							PassengerDisplay[i][0].nodeName = true;
							PassengerDisplay[i][0].informationName = "请输入乘客姓名";
							isSubmit = false;
						}
						if (PassengerDisplay[i][0].IDCard.length <= 0) {
							PassengerDisplay[i][0].nodeIDCard = true;
							PassengerDisplay[i][0].informationIDCard = "请输入乘客证件号";
							isSubmit = false;
						} else {
							var IDCard = this.identityIDCard(PassengerDisplay[i][0].IDCard);
							if (!IDCard.isPass) {
								PassengerDisplay[i][0].nodeIDCard = true;
								PassengerDisplay[i][0].informationIDCard = IDCard.errorMessage;
								this.submit = false;
							}
						}
					}

					if (isSubmit) {
						if (this.dataJudgmentMail()) {
							var Passengers = new Set();
							for (var i = 0; i < PassengerDisplay.length; i++) {
								Passengers.add({
									"name": PassengerDisplay[i][0].name,
									"IDCard": PassengerDisplay[i][0].IDCard,
									"phone": PassengerDisplay[i][0].phone
								});
							}

							var flightInformation = this.flightInformation;
							var flights = new Set();
							for (var i = 0; i < flightInformation.length; i++) {
								flights.add({
									"departure": flightInformation[i].accurateTime[0],
									"flight_id": flightInformation[i].flight_id,
									"model_id": flightInformation[i].model_id,
									"priceDifferentiation": flightInformation[i].priceDifferentiation,
									"transfer":flightInformation[i].transfer,
									"number":flightInformation[i].number
								});
							}

							var jsonObject = {
								"Passengers": [...Passengers],
								"flights": [...flights],
								"mailbox": this.mailbox.mail,
								"cityName":this.cityName,
								"cityNameTwo":this.cityNameTwo
							};

							axios.post("api/OrderAction/generateOrder", JSON.stringify(jsonObject), {
									headers: {
										'Content-Type': 'application/json'
									}
								})
								.then((res) => {
									if (res.data.code === 200) {
										if(res.data.data!=undefined){
											sessionStorage.setItem("orderId",res.data.data);
											location.href="/ticketInformation"
										}
									} else if (res.data.code === 401 || res.data.code === 403) {
										this.$alert(res.data.msg, '提示', {
											confirmButtonText: '确定',
											type: 'error',
											callback: action => {
												sessionStorage.removeItem("eleToken");
												sessionStorage.removeItem("mailbox");
												sessionStorage.removeItem("sessionId");
												location.href = "/Search";
											}
										});
									} else if (res.data.code === 720 || res.data.code === 721 || res.data.code ===
										722) {
										this.$confirm(res.data.msg+"，您可以重新选择航班或者选择其他舱位", '提示', {
											confirmButtonText: '确定',
											cancelButtonText: '重新选择航班',
											type: 'warning'
										}).then(() => {

										}).catch(() => {
											location.href = "/Search";
										});
									} else {
										this.$message({
											dangerouslyUseHTMLString: true,
											message: '<strong>' + res.data.msg + '</strong>',
											type: 'error'
										});
									}
								})
						}
					}

					this.button = "下一步";
					this.submit = false;
				}
			},
			dataJudgmentMail() {
				var fssa = true;
				var mail = this.mailbox.mail;
				if (mail != null && mail != '' && mail != undefined) {
					var reg = /^[0-9a-zA-Z_.-]+[@][0-9a-zA-Z_.-]+([.][a-zA-Z]+){1,2}$/;
					if (reg.test(mail)) {
						this.mailbox.nodeMail = false;
						this.mailbox.informationMail = "订单信息会发送到此邮箱，请注意查收";
					} else {
						this.mailbox.nodeMail = true;
						this.mailbox.informationMail = "请填写正确的邮箱格式";
						fssa = false;
					}
				} else {
					this.mailbox.nodeMail = true;
					this.mailbox.informationMail = "请输入联系人邮箱";
					fssa = false;
				}
				return fssa;
			},
			addPassengers() {
				if (this.PassengerDisplay.length == 5) {
					this.$message({
						message: '最多选择5人进行购票',
						type: 'warning'
					});
					return;
				}
				var PassengerDisplay = new Array(this.PassengerDisplay.length);
				for (var i = 0; i < this.PassengerDisplay.length; i++) {
					PassengerDisplay[i] = JSON.parse(JSON.stringify(this.PassengerDisplay[i]));
				}
				PassengerDisplay[this.PassengerDisplay.length] = JSON.parse(JSON.stringify(this.template));
				PassengerDisplay[this.PassengerDisplay.length][2] = this.PassengerDisplay.length + 1;
				this.PassengerDisplay = PassengerDisplay;

			},
			deletePassengers(passengerId,execute) {
				var PassengerDisplay = this.PassengerDisplay;
				this.cancellation(passengerId);
				PassengerDisplay.splice(passengerId - 1, 1);
				for (var i = 0; i < PassengerDisplay.length; i++) {
					PassengerDisplay[i][2] = i + 1;
				}
				if (this.PassengerDisplay.length == 0) {
					var PassengerDisplay = new Array(1);
					PassengerDisplay[0] = JSON.parse(JSON.stringify(this.template));
					this.PassengerDisplay = PassengerDisplay;
				}
				if(execute!==1){
					this.cleanClass();
				}
			},
			changecheck(itself, passenger) {
				var PassengerDisplay = this.PassengerDisplay;
				if (itself) {
					var objective = false;
					var length = this.PassengerDisplay.length;

					for (var i = 0; i < PassengerDisplay.length; i++) {
						if (PassengerDisplay[i][3] == passenger.passenger_name) {
							return;
						}
					}

					for (var i = 0; i < PassengerDisplay.length; i++) {
						if (PassengerDisplay[i][0].name == "" && PassengerDisplay[i][0].IDCard == "" && PassengerDisplay[i]
							[0].phone == "" && PassengerDisplay[i][1] == 0) {
							PassengerDisplay[i][0].name = passenger.passenger_name;
							PassengerDisplay[i][0].IDCard = passenger.passenger_number;
							PassengerDisplay[i][0].phone = passenger.passenger_phone;
							PassengerDisplay[i][1] = 1;

							PassengerDisplay[i][3] = passenger.passenger_name;
							objective = true;
							this.cleanClass();
							break;
						}
					}
					if (!objective) {
						this.addPassengers();
						if (this.PassengerDisplay.length > length) {
							this.changecheck(true, passenger);
						}
					}
				} else {
					for (var i = 0; i < PassengerDisplay.length; i++) {
						if (PassengerDisplay[i][3] == passenger.passenger_name) {
							if (i == 0 && PassengerDisplay.length == 1) {
								this.cancellation(i + 1);
								var PassengerDisplay = new Array(1);
								PassengerDisplay[0] = JSON.parse(JSON.stringify(this.template));
								this.PassengerDisplay = PassengerDisplay;
								// this.cleanClass();
								return;
							}
							this.deletePassengers(i + 1);
							return;
						}
					}
				}
			},
			cleanClass() {
				this.dataJudgmentName();
				this.dataJudgmentIDCard();
			},
			cancellation(passengerId) {
				var PassengerDisplay = this.PassengerDisplay;
				if (PassengerDisplay[passengerId - 1][3] != "") {
					var PassengerList = this.PassengerList;
					for (var i = 0; i < PassengerList.length; i++) {
						if (PassengerList[i].passenger_name == PassengerDisplay[passengerId - 1][3]) {
							PassengerList[i].selected = false;
							break;
						}
					}
				}
			},
			dataJudgmentName() {
				var PassengerDisplay = this.PassengerDisplay;
				var index = new Map();
				for (var i = 0; i < PassengerDisplay.length; i++) {
					PassengerDisplay[i][0].nodeName = false;

					if (PassengerDisplay[i][0].name.length > 0) {
						var passenger = index.get(PassengerDisplay[i][0].name);
						if (passenger == undefined) {
							index.set(PassengerDisplay[i][0].name, new Set([i]));
						} else {
							passenger.add(i);
							index.set(PassengerDisplay[i][0].name, passenger);
						}
					} else {
						PassengerDisplay[i][0].nodeName = true;
						PassengerDisplay[i][0].informationName = "请输入乘客姓名";
					}
				}

				index.forEach((val, key) => {
					if (val.size > 1) {
						for (var item of val.values()) {
							PassengerDisplay[item][0].nodeName = true;
						}
					}
				})
			},
			dataJudgmentIDCard() {
				var PassengerDisplay = this.PassengerDisplay;
				var index = new Map();

				for (var i = 0; i < PassengerDisplay.length; i++) {
					PassengerDisplay[i][0].nodeIDCard = false;

					if (PassengerDisplay[i][0].IDCard.length > 0) {
						var passenger = index.get(PassengerDisplay[i][0].IDCard);
						if (passenger == undefined) {
							index.set(PassengerDisplay[i][0].IDCard, new Set([i]));
						} else {
							passenger.add(i);
							index.set(PassengerDisplay[i][0].IDCard, passenger);
						}
					} else {
						PassengerDisplay[i][0].nodeIDCard = true;
						PassengerDisplay[i][0].informationIDCard = "请输入乘客证件号";
					}
				}

				index.forEach((val, key) => {
					if (val.size > 1) {
						for (var item of val.values()) {
							PassengerDisplay[item][0].nodeIDCard = true;
						}
					}
				})
			},
			identityIDCard(code) {
				// 身份证号前两位代表区域
				const city = {
					11: '北京',
					12: '天津',
					13: '河北',
					14: '山西',
					15: '内蒙古',
					21: '辽宁',
					22: '吉林',
					23: '黑龙江 ',
					31: '上海',
					32: '江苏',
					33: '浙江',
					34: '安徽',
					35: '福建',
					36: '江西',
					37: '山东',
					41: '河南',
					42: '湖北 ',
					43: '湖南',
					44: '广东',
					45: '广西',
					46: '海南',
					50: '重庆',
					51: '四川',
					52: '贵州',
					53: '云南',
					54: '西藏 ',
					61: '陕西',
					62: '甘肃',
					63: '青海',
					64: '宁夏',
					65: '新疆',
					71: '台湾',
					81: '香港',
					82: '澳门',
					91: '国外 ',
				};
				const idCardReg =
					/^[1-9]\d{5}(19|20)?\d{2}(0[1-9]|1[012])(0[1-9]|[12]\d|3[01])\d{3}(\d|X)$/i; // 身份证格式正则表达式
				let isPass = true; // 身份证验证是否通过（true通过、false未通过）
				let errorMessage = ''; // 错误提示信息

				// 如果身份证不满足格式正则表达式
				if (!code) {
					errorMessage = '请输入身份证号码';
					isPass = false;
				} else if (!code.match(idCardReg)) {
					errorMessage = '请输入正确的身份证号码';
					isPass = false;
				} else if (!city[code.substr(0, 2)]) {
					// 区域数组中不包含需验证的身份证前两位
					errorMessage = '请输入正确的身份证号码';
					isPass = false;
				} else if (code.length === 18) {
					// 18位身份证需要验证最后一位校验位
					code = code.split('');
					// ∑(ai×Wi)(mod 11)
					// 加权因子
					const factor = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2];
					// 校验位
					const parity = [1, 0, 'X', 9, 8, 7, 6, 5, 4, 3, 2];
					let sum = 0;
					let ai = 0;
					let wi = 0;
					for (let i = 0; i < 17; i++) {
						ai = parseInt(code[i]);
						wi = factor[i];
						sum += ai * wi; // 开始计算并相加
					}
					const last = parity[sum % 11]; // 求余
					if (last.toString() !== code[17]) {
						errorMessage = '请输入正确的身份证号码';
						isPass = false;
					}
				}
				return {
					errorMessage,
					isPass,
				}
			}

		}
	}
</script>

<style>
	.colorAsh {
		border-bottom: #D8D8D8 1px solid;
	}

	.colorRed {
		border-bottom: red 1px solid;
	}

	.charactersAsh {
		color: #D8D8D8;
	}

	.charactersRed {
		color: red;
	}

	.select {
		color: #409EFF;
		outline: none;
		border-radius: 0px;
	}
</style>